<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<script type="text/javascript" src="http://t.wits.sg/misc/js/jQuery/jquery.js"></script>
		<script type="text/javascript" src="http://t.wits.sg/misc/js/jQuery/chili/jquery.chili-2.2.js"></script>
		<script type="text/javascript"> 
			ChiliBook.recipeFolder = "../js/jQuery/chili/";  
		</script>
		<script type="text/javascript" src="js/jquery.progressbar.js"></script>
		<script type="text/javascript">
                    var progress_key = '<?= $uuid ?>';

                    $(document).ready(function() {
                            $("#pb1").progressBar();
                    });
		</script>
                
                <script type="text/javascript">
                    function updateProgressBar() {
                        var count = 0;
                        if(document.getElementById("input1").value != "")
                            count = count +1;
                        $('#pb1').progressBar(count);
                    }
                </script>
                
	</head>
	<body>
            <div id="container">
                <div class="contentblock">
                    <table>
                            <tr><td>Progress bar</td><td><span class="progressBar" id="pb1">3</span></td></tr>
                    </table>
                    <a href="#" onclick="$('#pb1').progressBar(1);">1</a> |
                    <a href="#" onclick="$('#pb1').progressBar(2);">2</a> |
                    <a href="#" onclick="$('#pb1').progressBar(5);">5</a> |
                    <a href="#" onclick="$('#pb1').progressBar(8);">8</a> |
                    <a href="#" onclick="$('#pb1').progressBar(10);">10</a>
                </div>
            </div>
            <div>Année de construction : <input id="input1" type="text" onblur="updateProgressBar()"></input></div>
            <!-- Need this iframe for Safari and Chrome to work -->
            <iframe style="display: none;" name="progressFrame"></iframe>
	</body>
</html>
